<style type="text/css">
	.chart_page *{
		color: black !important;
	}
	.chart_page>div{
		margin:0 0 10px 5px;
		float: left;
		width: 100%;
	}
	.chart_page>div>table{
		float: left;
	}
	
	.chartTable tr td{
		padding-right: 3px;
	}
</style>

<div style="font-size:14px" class="chart_page">
	<div style="float:left">
		<table class='chartTable'>
			<tr>
				<td style="vertical-align: middle;">类型：</td>
				<td style="vertical-align:bottom;">
					<select id='chartType' class="my_select">
						<option value="line-bar">折柱线</option>
						<option value="chart-pie">饼状图</option>
					</select>
				</td>
				<td class='line-bar' style="vertical-align: middle;">X轴：</td>
				<td class='line-bar' style="vertical-align:bottom;">
					<select id='xAxis' class="my_select" style="margin-right:5px;width:90px"></select>
				</td>
				<td style="vertical-align: middle;">标题名：</td>
				<td style="vertical-align: middle;">
					<input type='text' id='chartTitle' style="width:150px;"/>
				</td>
				<td class='valPreCls' style="vertical-align: middle;">单位：</td>
				<td class='valPreCls' style="vertical-align: middle;">
					<input type='text' id='valPrefix' style="width:50px;"/>
				</td>
				<td class="chart-pie" style="padding-top:4px;padding-left:4px;">
					<button class="my_button addChartParam" type="button">添加</button>
				</td>
			</tr>
		</table>
	</div>
	<div style="float:left" class="line-bar">
		<table class='chartTable'>
			<tr>
				<td>Y轴(左)：</td>
				<td>
					<input type='text' id='leftYAxisName' style="width:60px;"/>
				</td>
				<td>
					<input type='checkbox' id='reverseLeftYAxis' />
				</td>
				<td>
					<label for='reverseLeftYAxis'>反向(左)</label>
				</td>
				<td>小数位：</td>
				<td>
					<input type='text' id='floatLeftNum' style="width:30px;"/>
				</td>
				<td>
					<input type='checkbox' id='showRightYAxis' />
				</td>
				<td>
					<label for='showRightYAxis'>添加Y轴(右)</label>
				</td>				
				<td>
					<button class="my_button addChartParam" type="button">添加</button>
				</td>
			</tr>
		</table>
	</div>
	<div style="float:left" class="line-bar">
		<table class='chartTable'>
			<tr style="display:none;" id='rightYAxisArea'>
				<td>
					Y轴(右)：
					<input id='rightYAxisName' type='text' style="width:60px;"/>
					<input type='checkbox' id='reverseRightYAxis' />
					<label for='reverseRightYAxis'>反向(右)</label>					
				</td>
				<td>小数位：</td>
				<td>
					<input type='text' id='floatRightNum' style="width:30px;"/>
				</td>
			</tr>
		</table>
	</div>
	<div id='chartConfigArea' style="float:left">
		<div style="height:250px;overflow-y: auto;">
			<table style="width:230x;margin-left:0;margin-right:7px;margin-bottom:0;border-width:0">
				<tr>
					<td style="padding:0 0 6px 0;">数据列</td>
					<td style="padding:0 0 6px 0;width:90px;">名称</td>
					<td style="padding:0 0 6px 0;width:90px;" class="line-bar">类型</td>
					<td style="padding:0 0 6px 0;width:90px;" class="line-bar">轴坐标</td>
					<td style="padding:0 0 6px 0;width:40px;" class="line-bar">数据处理</td>					
				</tr>
			</table>
		</div>
	</div>

	<div id='chartTabConLine' style="display:none;">
		<table>
			<tr>
				<td style="padding:0 10px 6px 0;vertical-align:bottom;">
					<select name='colNames' class="my_select" style="width:90px"></select>
				</td>
				<td style="padding:0 10px 6px 0;">
					<input type="hidden" name='axisName' style="width:90px;" />
				</td>
				<td style="padding:0 10px 6px 0;vertical-align:bottom;" class="line-bar">
					<select name='axisType' class="my_select" style="width:90px">
						<option value='line' selected="selected">过程线</option>
						<option value='bar'>柱状图</option>
					</select>
				</td>
				<td style="padding:0 10px 6px 0;vertical-align:bottom;" class="line-bar">
					<select name='axisOption' class="my_select" style="width:90px">
						<option value='leftYAxis' selected="selected">leftYAxis</option>
						<option value='rightYAxis'>rightYAxis</option>
					</select>
				</td>
				<td style="padding:0 10px 6px 0;vertical-align:bottom;" class="line-bar">
					<select name='dataPress' class="my_select" style="width:90px">
						<option value='noPress' selected="selected">不处理</option>
						<option value='smoothPress'>平滑处理</option>
					</select>
				</td>	
				<td style="vertical-align:top;margin-top:2px;">
					<button class="my_button" type="button" name='delLine'>删除</button>
				</td>
			</tr>
		</table>
	</div>
</div>